<?php include('header.php'); ?>
<!-- additional stylesheet hear -->

<style type="text/css">
	a.vote_up, a.vote_down {
	display:inline-block;
	background-repeat:none;
	background-position:center;
	height:16px;
	width:16px;
	margin-left:4px;
	text-indent:-900%;
}

	a.vote_up {
		background:url("<?=base_url();?>application/images/thumb_up.png");
	}
	
	a.vote_down {
		background:url("<?=base_url();?>application/images/thumb_down.png");
}
</style>
<!-- additional javascript hear -->
<script src="http://maps.google.com/maps?file=api&amp;v=3&amp;sensor=false&amp;key=ABQIAAAA1QnAxBtPWpvkkIJ1M7uNRhSaZr1EoDksNVh5CWAzOfD4zrQihBTtbZTHEHq4q97m9-r8YVi8kTiliA" type="text/javascript"></script>
	
<!-- Vote photo -->	
<script type='text/javascript'>
$(function(){
	$("a.vote_up").click(function(){
	//get the id
	the_id = $(this).attr('id');
	
	// show the spinner
	$(this).parent().html("<img src='<?=base_url();?>application/images/spinner.gif'/>");
	
	//fadeout the vote-count 
	$("span#votes_count"+the_id).fadeOut("fast");
	
	//the main ajax request
		$.ajax({
			type: "POST",
			data: "action=vote_up&id="+$(this).attr("id"),
			url: "<?=base_url();?>application/external/votes.php",
			success: function(msg)
			{
				$("span#votes_count"+the_id).html(msg);
				//fadein the vote count
				$("span#votes_count"+the_id).fadeIn();
				//remove the spinner
				$("span#vote_buttons"+the_id).remove();
			}
		});
	});
	
	$("a.vote_down").click(function(){
	//get the id
	the_id = $(this).attr('id');
	
	// show the spinner
	$(this).parent().html("<img src='<?=base_url();?>application/images/spinner.gif'/>");
	
	//the main ajax request
		$.ajax({
			type: "POST",
			data: "action=vote_down&id="+$(this).attr("id"),
			url: "<?=base_url();?>application/external/votes.php",
			success: function(msg)
			{
				$("span#votes_count"+the_id).fadeOut();
				$("span#votes_count"+the_id).html(msg);
				$("span#votes_count"+the_id).fadeIn();
				$("span#vote_buttons"+the_id).remove();
			}
		});
	});
});	
</script>

<!-- Java Script Resize by birdxcite
<script type="text/javascript">
function thumb_resize(which, max) {
var elem = document.getElementById(which);

if (elem == undefined || elem == null) return false;
var orig_width = elem.width;
var orig_height = elem.height;

if (max == undefined) max = 920;
if (elem.width > elem.height) {
if (elem.width > max) { elem.width = max; elem.height = orig_height*(max/orig_width);}
} else {
if (elem.height > max) { elem.height = max; elem.width = orig_width*(max/orig_height);};
}
} 
</script>
-->
</head>

<body onLoad="initialize();" onUnload="GUnload();">
<div id="wrapper">
<!-- menu -->
<?php include('menu.php'); ?>
<!-- end menu -->

<!-- navigator -->
<?php include('navigator.php'); ?>
<!-- nav end -->

<div class="container">
	<div class="span-960">
<?php

	if($this->session->flashdata('error'))
	{ 
		echo '<div class="error">' . $this->session->flashdata('error') . '</div>';
	}
	elseif($this->session->flashdata('success'))
	{
		echo '<div class="success">' . $this->session->flashdata('success') . '</div>';
	}
	
	echo validation_errors('<div class="error">', '</div>');
?>

<div class="item">
<img src="<?=base_url();?>application/images/Album.png" />
<h3><?=anchor('user/album/'. $photoUser , 'Album'); ?> รูปภาพของ
<?php 
	echo anchor('user/id/'. $photoUser , $this->usermodel->getName($photoUser));  
	echo " อัพโหลดเมื่อประมาณ: ";
	echo $this->usermodel->relativeTime($photoDatetime);
?>
<a href="http://twitter.com/share" class="twitter-share-button" data-count="horizontal" data-via="panoramap">Tweet</a><script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>
</h3><hr />
<p>
<!-- On Hosting Please uncomment
	<img id="<?=$photo[0]['caption'];?>" onload="thumb_resize('<?=$photo[0]['caption'];?>')" src="<?=base_url() . 'application/userdata/profile_' . $photo[0]['user_id'] . '/photos/' . $photo[0]['caption'];?>" alt="<?=$photo[0]['location']; ?>">
 -->
<div style="text-align:center;">
 <!-- Use phpThumb() Require Imagick! -->
<img src="<?=base_url();?>application/external/phpThumb/phpThumb.php?src=<?=base_url() . 'application/userdata/profile_' . $photoUser . '/photos/' . $photoCaption;?>&w=920&fltr[]=wmt|Photo+by+<?=$this->usermodel->getName($photoUser)?>%0Awww.panoramap.in.th|12|BR|FFFFFF|supermarket.ttf|80|50&f=png" alt="<?=$photoLoc; ?>">
 <!-- End phpThumb()  -->
</div>

<label></label>
<strong>สถานที่:</strong> <? echo $photoLoc; ?><br />
<strong>คำอธิบาย:</strong> <? echo $photoDetail; ?>
<br />
<strong>Ranking:</strong>
<?php
/**
Display the results from the database
**/
$photoId = $this->uri->segment(3);
$q = "SELECT * FROM photos WHERE photo_id=$photoId";
$r = mysql_query($q);

if(mysql_num_rows($r)>0): //table is non-empty
	while($row = mysql_fetch_assoc($r)):
		$net_vote = $row['votes_up'] - $row['votes_down']; //this is the net result of voting up and voting down
?>
	<span class='votes_count' id='votes_count<?php echo $row['photo_id']; ?>'><?php echo $net_vote." votes"; ?></span>
	
	<span class='vote_buttons' id='vote_buttons<?php echo $row['photo_id']; ?>'>
		<a href='javascript:;' class='vote_up' id='<?php echo $row['photo_id']; ?>'>Vote Up!</a>
		<a href='javascript:;' class='vote_down' id='<?php echo $row['photo_id']; ?>'>Vote Down!</a>
	</span>
<?php
	endwhile;
	endif;
?>
</p>

<p>
<a href="http://twitter.com/share" class="twitter-share-button" data-count="vertical" data-via="panoramap">Tweet</a><script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script>
</p>
<p>
	<h3>ตำแหน่งรูปภาพ</h3><hr />
<?php
	$geo = $this->photomodel->getGeo($photoLat, $photoLng);
	if($geo == false)
	{
		echo "ไม่พบตำแหน่งของภาพนี้&nbsp;" ;
	}
	else
	{
		echo "<p>$geo</p>";
?>
<script type="text/javascript">
var lat = "<?=$photoLat;?>";
var lng = "<?=$photoLng;?>";

    function initialize() {
      if (GBrowserIsCompatible()) {
        var map = new GMap2(document.getElementById("map_canvas"));
        map.setCenter(new GLatLng(lat, lng), 10);
		var point = new GLatLng(lat,lng);
		var marker = new GMarker(point);
		map.addOverlay(marker);
        }
      }
</script>
<div id="map_canvas" style="border:1px solid #333333; width: 900px; height: 200px"></div>
<? } ?>
</p>
<div id="disqus_thread"></div>
<script type="text/javascript">
  /**
    * var disqus_identifier; [Optional but recommended: Define a unique identifier (e.g. post id or slug) for this thread] 
    */
  (function() {
   var dsq = document.createElement('script'); dsq.type = 'text/javascript'; dsq.async = true;
   dsq.src = 'http://panoramap.disqus.com/embed.js';
   (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(dsq);
  })();
</script>
<noscript>Please enable JavaScript to view the <a href="http://disqus.com/?ref_noscript=panoramap">comments powered by Disqus.</a></noscript>
<a href="http://disqus.com" class="dsq-brlink">blog comments powered by <span class="logo-disqus">Disqus</span></a>
<script type="text/javascript">
//<![CDATA[
(function() {
	var links = document.getElementsByTagName('a');
	var query = '?';
	for(var i = 0; i < links.length; i++) {
	if(links[i].href.indexOf('#disqus_thread') >= 0) {
		query += 'url' + i + '=' + encodeURIComponent(links[i].href) + '&';
	}
	}
	document.write('<script charset="utf-8" type="text/javascript" src="http://disqus.com/forums/panoramap/get_num_replies.js' + query + '"></' + 'script>');
})();
//]]>
</script>
</div>
</div>
</div>
<!-- footer -->
<?php include('footer.php');?>
<!-- footer end -->
</div>
</body>
</html>